<template>
    <div class="intention">
        <div style="position: fixed;width: 100%;background: #fff;z-index: 99;">
            <bar text="意向客户"></bar>
        </div>
        <div class="deatil">
            <div v-for="item in list" class="detailBox">
                <div class="detailTop">
                    <p>{{item.brand}} (服装)</p>
                    <span>来源：广告</span>
                </div>
                <p style="margin-top: 14px;margin-left: 20px;font-size: 12px;color: #999999;margin-bottom: 6px;">意向客户联系方式</p>
                <div class="deatilUser">
                    <img src="./images/Contacts.png" alt="">
                    <p>姓名：{{item.name }}</p>
                </div>
                <div class="deatilUser">
                    <img src="./images/phone.png" alt="">
                    <p>电话：{{item.tel }}</p>
                </div>
                <div class="detailBottom">
                    <p class="detailBottomLsft">负责人：{{item.picname }}</p>
                    <p class="detailBottomRight">报价： <span>{{item.offer }}万/月</span></p>
                </div>
            </div>
            <!--<div class="detailBox">-->
                <!--<div class="detailTop">-->
                    <!--<p>品牌名称 (服装)</p>-->
                    <!--<span>来源：广告</span>-->
                <!--</div>-->
                <!--<p style="margin-top: 14px;margin-left: 20px;font-size: 12px;color: #999999;margin-bottom: 6px;">意向客户联系方式</p>-->
                <!--<div class="deatilUser">-->
                    <!--<img src="./images/Contacts.png" alt="">-->
                    <!--<p>姓名：小雨</p>-->
                <!--</div>-->
                <!--<div class="deatilUser">-->
                    <!--<img src="./images/phone.png" alt="">-->
                    <!--<p>电话：18341915761</p>-->
                <!--</div>-->
                <!--<div class="detailBottom">-->
                    <!--<p class="detailBottomLsft">负责人：王源</p>-->
                    <!--<p class="detailBottomRight">报价： <span>15万/月</span></p>-->
                <!--</div>-->
            <!--</div>-->
            <!--<div class="detailBox">-->
                <!--<div class="detailTop">-->
                    <!--<p>品牌名称 (服装)</p>-->
                    <!--<span>来源：广告</span>-->
                <!--</div>-->
                <!--<p style="margin-top: 14px;margin-left: 20px;font-size: 12px;color: #999999;margin-bottom: 6px;">意向客户联系方式</p>-->
                <!--<div class="deatilUser">-->
                    <!--<img src="./images/Contacts.png" alt="">-->
                    <!--<p>姓名：小雨</p>-->
                <!--</div>-->
                <!--<div class="deatilUser">-->
                    <!--<img src="./images/phone.png" alt="">-->
                    <!--<p>电话：18341915761</p>-->
                <!--</div>-->
                <!--<div class="detailBottom">-->
                    <!--<p class="detailBottomLsft">负责人：王源</p>-->
                    <!--<p class="detailBottomRight">报价： <span>15万/月</span></p>-->
                <!--</div>-->
            <!--</div>-->
        </div>
    </div>
</template>

<script>
    import titles from "../../components/titleBar";
    import bar from "../../components/topBar";
    export default {
        props: {},
        components: {
            titles,
            bar,
        },
        name: "intention",
        data() {
            return {
                list:[]
            };
        },
        methods:{
            detailList(){
                // alert()
                var fid = this.$route.query.fid
                this.$api.get('market/store/pot_cust?fid=' + fid, {}, response => {
                    if (response.status >= 200 && response.status < 300) {
                        // console.log(response.data.data);
                        this.list = response.data.data
                    } else {
                        console.log(response.message);
                        //请求失败，response为失败信息
                    }
                });
            }
        },
        mounted(){
            this.detailList()
        }
    }
</script>

<style scoped lang="scss">
    p{
        text-align: left;
    }
    .intention{
        .deatil{
            padding-top: 68px;
            margin: 0 20px;
            .detailBox{
                width: 338px;
                height: 209px;
                background:rgba(255,255,255,1);
                box-shadow:0px 1px 5px 2px rgba(0,0,0,0.06);
                border-radius:5px;
                margin-bottom: 14px;
                .detailTop{
                    width: 296px;
                    margin: 0 auto;
                    border-bottom: 0.5px solid #E8E8E8;
                    padding-bottom: 15px;
                    display: flex;
                    align-items: center;
                    padding-top: 20px;
                    p{
                        font-size: 15px;
                        color: #333333;
                        flex: 1;
                    }
                    span{
                        font-size: 12px;
                        color: #999999;
                    }
                }
                .deatilUser{
                    display: flex;
                    align-items: center;
                    margin-left: 20px;
                    margin-top: 11px;
                    img{
                        width: 19px;
                        height: 19px;
                    }
                    p{
                        margin-left: 12px;
                        color: #333333;
                        font-size: 15px;
                    }
                }
                .detailBottom{
                    width: 295px;
                    margin: 6px auto 0 auto;
                    border-top: 0.5px solid #E8E8E8;
                    display: flex;
                    align-items: center;
                    padding-top: 17px;
                    .detailBottomLsft{
                        color: #333333;
                        font-size: 15px;
                        flex: 1;
                    }
                    .detailBottomRight{
                        color: #333333;
                        font-size: 15px;
                        span{
                            color: #6494FF;
                        }
                    }
                }
            }
        }
    }
</style>